var ha = document.querySelector("#ha");
var ls = document.querySelector(".ls");
b = true;
ha.addEventListener("click",function(){
    if (b){
        ls.style.display = "block";
    }else {
        ls.style.display = "none";
    }
    b =! b;
});


//滚动条事件








window.onscroll = function(){

    aa = window.onscroll;
    bb = null;
    console.log(document.body.scrollTop);

    var a = 300 < 1000;
        if (document.documentElement.scrollTop > a || document.body.scrollTop > a && document.documentElement.scrollTop < 600 || document.body.scrollTop < 600) {
            var num = 0;
            var t = setInterval(function () {
                num++;
                var span1 = document.getElementById("span1");
                span1.innerHTML = num;
                if (num == 4) {
                    clearInterval(t);
                }
            }, 1000);
            var num2 = 0;
            var u = setInterval(function () {
                num2++;
                var span2 = document.getElementById("span2");
                span2.innerHTML = num2;
                if (num2 == 700) {
                    clearInterval(u);
                }
            }, 6);
            var num3 = 0;
            var i = setInterval(function () {
                num3++;
                var span3 = document.getElementById("span3");
                span3.innerHTML = num3;
                if (num3 == 375) {
                    clearInterval(i);
                }
            }, 10);
            window.onscroll = bb;
        }



    };




//var makeItRain = function() {
//    //clear out everything
//    $('.rain').empty();
//
//    var increment = 0;
//    var drops = "";
//    var backDrops = "";
//
//    while (increment < 100) {
//        //couple random numbers to use for various randomizations
//        //random number between 98 and 1
//        var randoHundo = (Math.floor(Math.random() * (98 - 1 + 1) + 1));
//        //random number between 5 and 2
//        var randoFiver = (Math.floor(Math.random() * (5 - 2 + 1) + 2));
//        //increment
//        increment += randoFiver;
//        //add in a new raindrop with various randomizations to certain CSS properties
//        drops += '<div class="drop" style="left: ' + increment + '%; bottom: ' + (randoFiver + randoFiver - 1 + 100) + '%; animation-delay: 0.' + randoHundo + 's; animation-duration: 0.5' + randoHundo + 's;"><div class="stem" style="animation-delay: 0.' + randoHundo + 's; animation-duration: 0.5' + randoHundo + 's;"></div><div class="splat" style="animation-delay: 0.' + randoHundo + 's; animation-duration: 0.5' + randoHundo + 's;"></div></div>';
//        backDrops += '<div class="drop" style="right: ' + increment + '%; bottom: ' + (randoFiver + randoFiver - 1 + 100) + '%; animation-delay: 0.' + randoHundo + 's; animation-duration: 0.5' + randoHundo + 's;"><div class="stem" style="animation-delay: 0.' + randoHundo + 's; animation-duration: 0.5' + randoHundo + 's;"></div><div class="splat" style="animation-delay: 0.' + randoHundo + 's; animation-duration: 0.5' + randoHundo + 's;"></div></div>';
//    }
//
//    $('.rain.front-row').append(drops);
//    $('.rain.back-row').append(backDrops);
//};
//
//$('.splat-toggle.toggle').on('click', function() {
//    $('.body').toggleClass('splat-toggle');
//    $('.splat-toggle.toggle').toggleClass('active');
//    makeItRain();
//});
//
//$('.back-row-toggle.toggle').on('click', function() {
//    $('.body').toggleClass('back-row-toggle');
//    $('.back-row-toggle.toggle').toggleClass('active');
//    makeItRain();
//});
//
//$('.single-toggle.toggle').on('click', function() {
//    $('.body').toggleClass('single-toggle');
//    $('.single-toggle.toggle').toggleClass('active');
//    makeItRain();
//});
//
//makeItRain();